import React from 'react';
import {connect} from 'react-redux'
import style from './style.module.css'
import { Radio,Form, Input} from 'antd';

const ShopFormat = (props) => {
    const onFinish = (values) => {  //提交
        console.log('Success:', values);
      };
    const handleprice=(e)=>{  //售价
        // console.log(e.target.value)
        props.dispatch({
            type:'GET_NEWSHOP',
            payload:{
                sellingprice:e.target.value
            }
        })
    }
    const handleCostprice=(e)=>{  //成本价
        // console.log(e.target.value)
        props.dispatch({
            type:'GET_NEWSHOP',
            payload:{
                costprice:e.target.value
            }
        })
    }
    const handleOriginprice=(e)=>{//原价
        // console.log(e.target.value)
        props.dispatch({
            type:'GET_NEWSHOP',
            payload:{
                originprice:e.target.value
            }
        })
    }
    const handleStock=(e)=>{//库存
        // console.log(e.target.value)
        props.dispatch({
            type:'GET_NEWSHOP',
            payload:{
                stock:e.target.value
            }
        })
    }

    const {newShop}=props
    return (
        <div className='ShopFormat'>     
        <Radio style={{marginBottom:'15px'}} defaultValue>单规格</Radio>
        <Form
        layout='inline'
        wrapperCol={{ span: 14 }}
        onFinish={onFinish}
        initialValues={{ remember: true }}
        autoComplete="off"
        >
            <div className={style.opreate}>
                <p>售价</p>
                <div>
                    <Input 
                    style={{height:"30px"}} placeholder="0"
                    value={newShop.sellingprice}
                    onChange={handleprice}
                    />
                </div>
            </div>
            <div className={style.opreate}>
                <p>成本价</p>
                <div><Input name="costprice" style={{height:"30px"}} placeholder="0"
                value={newShop.costprice}
                onChange={handleCostprice}
                /></div>
            </div>
            <div className={style.opreate}>
                <p>原价</p>
                <div><Input name="originprice" style={{height:"30px"}} placeholder="0"
                value={newShop.originprice}
                onChange={handleOriginprice}/></div>
            </div>
            <div className={style.opreate}>
                <p>库存</p>
                <div><Input name="stock" style={{height:"30px"}} placeholder="0"
                value={newShop.stock}
                onChange={handleStock}/></div>
            </div>
        </Form>

        </div>
        
    );
}

export default connect((state)=>{
    return {
        newShop:state.newShop
    }
})(ShopFormat) ;
